<template>
  <div>
    <div class="agent_ul">
      <div class="agent_li flex" v-for="(item,index) in list" :key="index" @click="to('/card/', item.id)">
        <img class="agent_li_img" v-if="item.logo" :src="item.logo" alt />
        <img class="agent_li_img" v-if="!item.logo" src="@/assets/img/nodata.png" alt />
        <div class="flex-grow">
          <div class="rem-32px text-content text-cut-two">{{item.enterprise_title}}</div>
          <div class="flex justify-between margin-t40">
            <div class="rem-26px c-66 w-50p">链配网VIP会员</div>
            <div class="rem-26px c-66 w-50p">品类：{{item.type_name}}</div>
          </div>
        </div>
      </div>
    </div>

    <load @loadData="getBrowsing" :list="list" :total="total"></load>
  </div>
</template>

<script>
import load from "../components/load";
export default {
  components: {
    load
  },
  data() {
    return {
      list: [],
      total: 0
    };
  },
  mounted() {
    document.querySelector('html').style.backgroundColor = "#f5f5f5"
    this.getBrowsing(1);
  },
  methods: {
    // 代理商经销商
    getBrowsing(page) {
      this.$axios.post( "/wap/info/agent", {
        enterprise_id: this.$route.query.id,
        page: page,
        limit: 10
      }).then(res => {
        if (page == 1) {
          this.list = [];
          this.topList = [];
        }
        if (res.data.data.length == 0) {
          this.total++;
          return false;
        }
        for (let i in res.data.data) {
          this.list.push(res.data.data[i]);
        }
      });
    },
    to(path, id){
      this.$router.push({
        path: path,
        query: {
          id: id
        }
      })
    }
  }
};
</script>

<style scoped>
.agent_ul {
  padding: 0 0.2rem;
}
.agent_li {
  padding: 0.2rem 0;
  border-bottom: 1px solid #f4f4f4;
}
.agent_li:last-of-type {
  border-bottom: none;
}
.agent_li_img {
  width: 2.28rem;
  height: 1.73rem;
  display: block;
  margin-right: 0.12rem;
}
</style>